<template>
  <page-box class="list-box">
    <ul class="list-ul">
      <li class="list-li">
wdwad
      </li>
      <li class="list-li">
3366
      </li>
    </ul>
  </page-box>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import useList from "./useList";
export default defineComponent({
  setup() {
      const { list } = useList();
      return {
        list
      };
  }
});
</script>
<style lang="scss" scoped>
.list-ul{
  width: 100%;
  .list-li{
    width: 100%;
    padding: 20px;
    font-size: 18px;
    color: #fff;
    &:nth-child(2n+1){
      background: $main-color--1;
    }
    &:nth-child(2n+2){
      background: $main-color--2;
    }
  }
}
</style>
